import {ModalForm, ProFormRadio, ProFormSelect, ProFormText, ProFormTextArea} from '@ant-design/pro-components';
import React, {useEffect, useState} from 'react';
import {Collapse} from "antd";
import {list} from '@/services/node-api'
import {list as canalList} from '@/services/canal-api'
import {BaseOptionType} from "rc-select/es/Select";
import {Link} from "@umijs/max";

export type CreateOrUpdateFormProps = {
  onCancel: (flag?: boolean, formVals?: API.Pipeline) => void;
  onSubmit: (values: API.Pipeline) => Promise<void>;
  updateModalOpen: boolean;
  values?: Partial<API.Pipeline>;
  title?: string;
  refreshCount?:number;
};

const CreateOrUpdateForm: React.FC<CreateOrUpdateFormProps> = (props) => {

  const [node,setNodes] = useState<BaseOptionType[]>();
  const [canals,setCanals] = useState<BaseOptionType[]>();
  useEffect(() => {
    list({size:100})
      .then(res => res["data"])
      .then(data => data.map((s:API.NodeDTO) => ({label: s.name, value:s.id})))
      .then(d => setNodes(d));
  },[props?.refreshCount]);
  useEffect(() => {
    canalList({size:100})
      .then(res => res["data"])
      .then(data => data.map((s:API.CanalDTO) => ({label: s.name, value:s.name})))
      .then(d => setCanals(d));
  },[props?.refreshCount]);

  // 高级设置启用开关
  return (<ModalForm
      layout={"horizontal"}
      title={props?.title}
      width="700px"
      labelCol={{span: 8}}
      open={props.updateModalOpen}
      onFinish={props.onSubmit}
      modalProps={{destroyOnClose: true, onCancel: () => props.onCancel()}}
    >
      <ProFormText initialValue={props?.values?.id} hidden={true} name='id'/>
      <ProFormText initialValue={props?.values?.channelId} hidden={true} name='channelId'/>
      <ProFormText
        initialValue={props.values?.name}
        width="sm"
        label="pipeline名称"
        name={["name"]}
        rules={[{
          required:true,
          message:'pipeline名称不能为空'
        }]}
      />
      <ProFormSelect
        initialValue={props?.values?.selectNodes?.map(n => n.id)}
        width="sm"
        mode={'multiple'}
        label="Select机器"
        transform={(value) => ({selectNodes:(value?.map((v:number) => ({id: v}))||[])})}
        name={["selectNodes","id"]}
        tooltip={<>配置<Link to={"/machine-manager/node"}>Node</Link></>}
        options={node}
        rules={[{
          required:true,
          message:'select机器不能为空'
        }]}
      />
      <ProFormSelect
        initialValue={props?.values?.loadNodes?.map(n => n.id)}
        width="sm"
        mode={'multiple'}
        label="Load机器"
        name={["loadNodes", "id"]}
        tooltip={<>配置<Link to={"/machine-manager/node"}>Node</Link></>}
        transform={(value) => ({loadNodes:(value?.map((v:number) => ({id: v}))||[])})}
        options={node}
        rules={[{
          required:true,
          message:'load机器不能为空'
        }]}
      />
      <ProFormText
        initialValue={props.values?.parameters?.parallelism || 5}
        width="sm"
        label="并行度"
        name={["parameters", "parallelism"]}
        rules={[{
          required:true,
          message:'并行度不能为空'
        }]}
      />
      <ProFormText
        initialValue={props.values?.parameters?.extractPoolSize || 10}
        width="sm"
        label="数据反查线程数"
        name={["parameters", "extractPoolSize"]}
        rules={[{
          required:true,
          message:'数据反查线程数不能为空'
        }]}
      />
      <ProFormText
        initialValue={props.values?.parameters?.loadPoolSize || 15}
        width="sm"
        label="数据载入线程数"
        name={["parameters", "loadPoolSize"]}
        rules={[{
          required:true,
          message:'数据载入线程数不能为空'
        }]}
      />
      <ProFormText
        initialValue={props.values?.parameters?.fileLoadPoolSize || 15}
        width="sm"
        label="文件载入线程数"
        name={["parameters", "fileLoadPoolSize"]}
        rules={[{
          required:true,
          message:'文件载入线程数不能为空'
        }]}
      />
      <ProFormRadio.Group
        initialValue={props.values?.parameters?.home || false}
        name={["parameters", "home"]}
        label="主站点"
        radioType="radio"
        options={[
          {
            label: '是',
            value: true,
          },
          {
            label: '否',
            value: false,
          },
        ]}/>
      <ProFormRadio.Group
        initialValue={props.values?.parameters?.selectorMode || 'Canal'}
        name={["parameters", "selectorMode"]}
        label="同步数据来源"
        radioType="radio"
        options={[
          {
            label: 'Canal',
            value: 'Canal',
          }
        ]}/>
      <ProFormSelect
        label="Canal名字"
        width="sm"
        initialValue={props?.values?.parameters?.destinationName}
        name={["parameters", "destinationName"]}
        options={canals}
        tooltip={<>配置<Link to={"/config-manager/canal"}>Canal</Link></>}
        rules={[{
          required:true,
          message:'Canal名字机器不能为空'
        }]}
      />
      <ProFormText
        initialValue={props.values?.parameters?.mainstemBatchsize || 6000}
        width="sm"
        label="主道消费批次大小"
        name={["parameters", "mainstemBatchsize"]}
        rules={[{
          required:true,
          message:'主道消费批次大小不能为空'
        }]}
      />
      <ProFormText
        initialValue={props.values?.parameters?.batchTimeout || -1}
        width="sm"
        tooltip='格式: -1不进行控制，0代表永久，>0则按照指定时间控制'
        label="获取批次数据超时时间(毫秒)"
        name={["parameters", "batchTimeout"]}
        rules={[{
          required:true,
          message:'获取批次数据超时时间不能为空'
        }]}
      />
      <ProFormText
        initialValue={props.values?.parameters?.loadBatchsize || 50}
        width="sm"
        label="Load批次大小"
        name={["parameters", "loadBatchsize"]}
        rules={[{
          required:true,
          message:'Load批次大小不能为空'
        }]}
      />
      <ProFormTextArea width="md" name="description" label="描述" initialValue={props?.values?.description}/>

      <Collapse collapsible={'icon'} bordered={false} ghost items={[{
        key: '1', label: '高级设置', forceRender:true, children:
          <>
            <ProFormRadio.Group
              initialValue={props.values?.parameters?.useBatch || true}
              name={["parameters", "useBatch"]}
              label="使用batch"
              width={'sm'}
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>
            <ProFormRadio.Group
              initialValue={props.values?.parameters?.skipSelectException || false}
              name={["parameters", "skipSelectException"]}
              label="是否跳过Select异常"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>
            <ProFormRadio.Group
              initialValue={props.values?.parameters?.skipLoadException || false}
              name={["parameters", "skipLoadException"]}
              label="是否跳过Load异常"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>
            <ProFormSelect
              initialValue={props.values?.parameters?.arbitrateMode || "AUTOMATIC"}
              label="仲裁器调度模式"
              width="md"
              name={["parameters", "arbitrateMode"]}
              rules={[{
                required:true,
                message:'仲裁器调度模式不能为空'
              }]}
              options={[
                {
                  label: 'AUTOMATIC',
                  value: 'AUTOMATIC',
                },
                {
                  label: 'RPC',
                  value: 'RPC',
                },
                {
                  label: 'ZOOKEEPER',
                  value: 'ZOOKEEPER',
                },
                {
                  label: 'MEMORY',
                  value: 'MEMORY',
                },
              ]}
            />
            <ProFormSelect
              initialValue={props.values?.parameters?.lbAlgorithm || "Stick"}
              label="负载均衡算法"
              width="md"
              rules={[{
                required:true,
                message:'负载均衡算法不能为空'
              }]}
              name={["parameters", "lbAlgorithm"]}
              options={[
                {
                  label: 'Stick',
                  value: 'Stick',
                },
                {
                  label: 'RoundRbin',
                  value: 'RoundRbin',
                },
                {
                  label: 'Random',
                  value: 'Random',
                }
              ]}
            />
            <ProFormSelect
              initialValue={props.values?.parameters?.pipeChooseType || "AUTOMATIC"}
              label="传输模式"
              width="md"
              name={["parameters", "pipeChooseType"]}
              rules={[{
                required:true,
                message:'传输模式不能为空'
              }]}
              options={[
                {
                  label: 'AUTOMATIC',
                  value: 'AUTOMATIC',
                },
                {
                  label: 'RPC',
                  value: 'RPC',
                },
                {
                  label: 'HTTP',
                  value: 'HTTP',
                }
              ]}
            />
            <ProFormRadio.Group
              initialValue={props.values?.parameters?.dumpSelector || true}
              name={["parameters", "dumpSelector"]}
              label="记录selector日志"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>
            <ProFormRadio.Group
              initialValue={props.values?.parameters?.dumpSelectorDetail || false}
              name={["parameters", "dumpSelectorDetail"]}
              label="记录selector详细日志"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>
            <ProFormRadio.Group
              initialValue={props.values?.parameters?.dumpEvent || false}
              name={["parameters", "dumpEvent"]}
              label="记录load日志"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>

            <ProFormRadio.Group
              initialValue={props.values?.parameters?.dryRun || false}
              name={["parameters", "dryRun"]}
              label="dryRun模式"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>

            <ProFormRadio.Group
              initialValue={props.values?.parameters?.ddlSync || true}
              name={["parameters", "ddlSync"]}
              label="支持ddl同步"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>


            <ProFormRadio.Group
              initialValue={props.values?.parameters?.skipDdlException || false}
              name={["parameters", "skipDdlException"]}
              label="跳过ddl异常"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>

            <ProFormRadio.Group
              initialValue={props.values?.parameters?.fileDetect || false}
              name={["parameters", "fileDetect"]}
              label="文件重复同步对比"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>

            <ProFormRadio.Group
              initialValue={props.values?.parameters?.useFileEncrypt || false}
              name={["parameters", "useFileEncrypt"]}
              label="文件传输加密"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>

            <ProFormRadio.Group
              initialValue={props.values?.parameters?.useExternalIp || false}
              name={["parameters", "useExternalIp"]}
              label="启用公网同步"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>


            <ProFormRadio.Group
              initialValue={props.values?.parameters?.skipFreedom || false}
              name={["parameters", "skipFreedom"]}
              label="跳过自由门数据"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>


            <ProFormRadio.Group
              initialValue={props.values?.parameters?.skipNoRow || false}
              name={["parameters", "skipNoRow"]}
              label="跳过反查无记录数据"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>

            <ProFormRadio.Group
              initialValue={props.values?.parameters?.useTableTransform || false}
              name={["parameters", "useTableTransform"]}
              label="启用数据表类型转化"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>

            <ProFormRadio.Group
              initialValue={props.values?.parameters?.enableCompatibleMissColumn || false}
              name={["parameters", "enableCompatibleMissColumn"]}
              label="兼容字段新增同步"
              width="md"
              radioType="radio"
              options={[
                {
                  label: '是',
                  value: true,
                },
                {
                  label: '否',
                  value: false,
                },
              ]}/>

            <ProFormText
              initialValue={props.values?.parameters?.channelInfo}
              width="md"
              label="自定义同步标记"
              name={["parameters", "channelInfo"]}
            />
          </>
      }]}
      />

    </ModalForm>
  );
};

export default CreateOrUpdateForm;
